import React from 'react'
import styles from './index.module.less'
import logo from '../../assets/logo.png'
import { Button, Input, Form,Toast } from 'react-vant'
import { useNavigate } from 'react-router-dom';
import { useLocation } from 'react-router-dom';
import 'animate.css';
import axios from '../../api/index';
import toast, { Toaster } from 'react-hot-toast';
export default function Login() {
  const navigate = useNavigate();
const [form] = Form.useForm();
  const {state} = useLocation(); 
 const onFinish = values => {
     console.log(values)
    axios.post('/user/login',values).then(res=>{
      console.log(res);
      if(res.data.code === '1'){
        console.log(res.data);
        
        localStorage.setItem('userInfo',JSON.stringify(res.data))
        localStorage.setItem('access_token',res.access_token)
        localStorage.setItem('refresh_token',res.refresh_token)
        toast.success('登录成功')
        navigate('/home')
      }
    })
  }

  return (
    <div className={styles.login}>
     <div className={styles['title-wrapper']}>
      <h1 className='animate__animated animate__shakeY'>CodeMaster</h1>
     </div>
      <div className={styles['login-wrapper']}>
        <div className={styles.avater}>
          <img className={styles['avater-img']} src={logo} alt="" />
        </div>
        <Form
          form={form}
          onFinish={onFinish}
          footer={
            <div style={{ margin: '16px 16px 0' }}>
              <Button round nativeType='submit' type='primary' block>
                登录
              </Button>
            </div>
          }
        >
          <Form.Item
            rules={[{ required: true, message: '请填写用户名' }]}
            name='username'
            label='用户名'
            labelWidth={50}
            initialValue={state?.username}
          >
            <Input placeholder='请输入用户名' />
          </Form.Item>
          <Form.Item
            rules={[{ required: true, message: '请填写密码' }]}
            name='password'
            label='密码'
            labelWidth={50}
            initialValue={state?.password}
          >
            <Input placeholder='请输入密码'  />
          </Form.Item>
        </Form>
 

      </div>

      <p className={styles['login-tip']} onClick={()=>{
        navigate('/register')
      }}>
        没有账号？点这里注册
      </p>
    </div>
   
  )
}
